<script lang="ts" setup>
import { ref } from 'vue';
import { Search } from '@element-plus/icons-vue';
import { User, tableData } from './trumpet-mock';
const trumpet = ref<string>();
const multipleSelection = ref<User[]>([]);
const handleSelectionChange = (val: User[]) => {
  multipleSelection.value = val;
};
</script>

<template>
  <div class="home-container trumpet-container">
    <div class="w100 pl8 pt8 pb8 pr8 flex screan">
      <el-input v-model="trumpet" class="mr8" placeholder="请输入搜索的小号昵称" :suffix-icon="Search" />
      <el-button size="default" type="primary">
        获取小号
      </el-button>
    </div>
    <div class="w100">
      <!-- :max-height="280" -->
      <el-table class="w100" :data="tableData" @selection-change="handleSelectionChange">
        <el-table-column type="selection" width="40" />
        <el-table-column property="serialNumber" label="序号" />
        <el-table-column property="name" label="名称" show-overflow-tooltip />
      </el-table>
    </div>
  </div>
</template>

<style lang="scss" scoped>
.trumpet-container {

  .screan {
    border-bottom: 1px solid #f1f2f3;
  }
}
</style>